<?xml version='1.0' encoding='UTF-8' ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<ui:composition xmlns="http://www.w3.org/1999/xhtml"
                xmlns:p="http://primefaces.prime.com.tr/ui"
                xmlns:h="http://java.sun.com/jsf/html"
                xmlns:f="http://java.sun.com/jsf/core"
                xmlns:ui="http://java.sun.com/jsf/facelets"
                xmlns:c="http://java.sun.com/jsp/jstl/core"
                template="./../templates/StakeholderPortalTemplate.xhtml">
    <ui:define name="content">
    <h:body>
        <h:form id="formMain">                     
            
            <p:panel id="panel" header="View Transactions by Date">
                <p:ajaxStatus style="width:16px;height:16px;">
                    <f:facet name="start">
                        <h:graphicImage value="http://www.primefaces.org:8080/showcase/design/ajaxloading.gif" />
                    </f:facet>
                    <f:facet name="complete">
                        <h:outputText value="" />
                    </f:facet>
                </p:ajaxStatus>
                
                <h:panelGrid columns="3" cellpadding="10">
                    <h3>From dd.MM.yyyy</h3>  
                    <p:calendar required="true" label="Start Date" requiredMessage="Start Date is required." id="startDate" value="#{transactionManagerBean.date1}" pattern="dd.MM.yyyy" />   
                    <p:message for="startDate" />
                    
                    <h3>To dd.MM.yyyy</h3>  
                    <p:calendar required="true" label="End Date" requiredMessage="End Date is required." id="endDate" value="#{transactionManagerBean.date2}" pattern="dd.MM.yyyy"/>     
                    <p:message for="startDate" />
                    <p:dialog header="Selected Dates" widgetVar="dialog"   
                                showEffect="fold" hideEffect="fold"  
                                height="150">  
      
                        <h:panelGrid id="display" columns="2" cellpadding="5">  
                            <h:outputText value="dd.MM.yyyy: " />  
                            <h:outputText value="#{transactionManagerBean.date1}">  
                                <f:convertDateTime pattern="dd.MM.yyyy" />  
                            </h:outputText>  
              
                            <h:outputText value="dd.MM.yyyy: " />  
                            <h:outputText value="#{transactionManagerBean.date2}">  
                                <f:convertDateTime pattern="dd.MM.yyyy" />  
                            </h:outputText>   
              
                        </h:panelGrid>  
                    </p:dialog>

                </h:panelGrid>
                <p:commandButton id="btn" value="View Transactions by Date" action="stakeholder/StakeholderViewAllTransactions?faces-redirect=true" update="panel" actionListener="#{transactionManagerBean.viewTransactionsStakeholderByDate}" ajax="true" />
            </p:panel>
        </h:form>
        
        <h:form id="formSecond">
            <p:panel id="panel1" header="View All Transactions">
                <p:ajaxStatus style="width:16px;height:16px;">
                    <f:facet name="start">
                        <h:graphicImage value="http://www.primefaces.org:8080/showcase/design/ajaxloading.gif" />
                    </f:facet>
                    <f:facet name="complete">
                        <h:outputText value="" />
                    </f:facet>
                </p:ajaxStatus>
   
                <p:commandButton id="btn1" value="View All Transactions" action="stakeholder/StakeholderViewAllTransactions?faces-redirect=true" update="panel1" actionListener="#{transactionManagerBean.viewAllTransactionsStakeholder}" ajax="true" />
            </p:panel>
        </h:form>
    </ui:define>
</ui:composition>